<template>
  <div class="home">
    <h1>Pinia - 基本使用</h1> 
    <h3>count: {{ counterStore.count }}</h3>
    <h3>count: {{ count }}</h3>
    <button @click="counterStore.count++">count: {{ count }}</button>
  </div>
</template>

<script setup>
// @ is an alias to /src
import { toRefs } from 'vue';
import { storeToRefs } from 'pinia';
import useCounter from '@/pinia/counter'
const counterStore = useCounter()
//  不是响应式 
// 1.pinia storeToRefs 转成ref
// 1.vue toRefs 转成ref
const { count } = storeToRefs(useCounter())

</script>
